import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:toolbox/page/browser/browser_logic.dart';
import 'package:toolbox/page/home/component/homeDrawer.dart';

import '../../common/strings.dart';
import 'home_logic.dart';
import 'home_state.dart';

class HomePage extends StatelessWidget {
  HomePage({super.key});

  final HomeLogic logic = Get.put(HomeLogic());
  final HomeState state = Get.find<HomeLogic>().state;

  @override
  Widget build(BuildContext context) {
    return PopScope(
      onPopInvoked: logic.onPopInvoked,
      canPop: false,
      child: GestureDetector(
        onTap: logic.onTapBg,
        child: GetBuilder<HomeLogic>(builder: (HomeLogic controller) {
          return Scaffold(
            appBar: AppBar(
              title: state.currentPage == state.browserPage ? browserTitle() : const Text('Ciallo～${Strings.ciallo}'),
              leading: Padding(
                padding: const EdgeInsets.only(left: 15),
                child: Center(
                  child: Builder(builder: (context) {
                    state.context = context;
                    return IconButton(
                      icon: const Icon(Icons.list),
                      onPressed: logic.showDrawer,
                    );
                  }),
                ),
              ),
              actions: state.currentPage == state.browserPage ? [
                IconButton(
                  onPressed: logic.onTapStarWeb,
                  icon: state.hadStar ? const Icon(Icons.star) : const Icon(Icons.star_border),
                ),
              ] : null,
            ),
            body: state.currentPage,
            drawer: HomeDrawer(),
          );
        },),
      ),
    );
  }

  Widget browserTitle() {
    var logic = Get.find<BrowserLogic>();
    void onTapTitle() {
      state.editWebTitle.value = true;
    }

    return Obx(
      () => state.editWebTitle.value
          ? TextFormField(
              initialValue: logic.state.currentUrl.value,
              autofocus: true,
              textInputAction: TextInputAction.search,
              decoration: const InputDecoration(
                hintText: 'https://',
              ),
              onEditingComplete: () {
                state.editWebTitle.value = false;
              },
              onFieldSubmitted: (value) {
                print(value);
                logic.loadWeb(url: value);
              },
            )
          : logic.state.currentWebsiteFetch.value == null
              ? GestureDetector(
                  onTap: onTapTitle,
                  child: Text(logic.state.currentUrl.value),
                )
              : GestureDetector(
                  onTap: onTapTitle,
                  child: Row(
                    children: [
                      Padding(
                        padding: const EdgeInsets.only(right: 8),
                        child: Image.network(
                          logic.state.currentWebsiteFetch.value?.image ?? '',
                          height: 25,
                          width: 25,
                          fit: BoxFit.fill,
                          errorBuilder: (_, __, ___) {
                            return const Icon(Icons.web, size: 25);
                          },
                        ),
                      ),
                      Expanded(child: Text(logic.state.currentWebsiteFetch.value!.title)),
                    ],
                  ),
                ),
    );
  }
}
